<template>
    <div>     
      <el-table :data="tableData" stripe style="width: 100%" >
        <el-table-column prop="product_id" label="商品id"  width="100" />
        <el-table-column prop="product_title" label="商品名称"  width="100" />
        <el-table-column prop="amount" label="单价" width="200" />
        <el-table-column prop="total_amount" label="总金额" width="200" />  
        <el-table-column prop="buy_num" label="购买数量" width="200" />     
      </el-table>
      总数： {{ totalNum }}
      总金额： {{totalAmount}}
      实际支付金额：{{realPayAmount}}
    </div>
  </template>
  
  <script setup>
  import { ref, reactive, computed } from "vue"
  import requestUtil from "@/util/request"
  import { useRouter } from 'vue-router'

  const totalNum = ref();
  const totalAmount = ref();
  const realPayAmount = ref();
  
  const form = ref({})
  const tableData=ref({})
 
  const queryForm=ref({
    query:'',
    pageNum:1,
    pageSize:10
  })
const router = useRouter()
  
  
  const initShopList=async()=>{
    const res=await requestUtil.get("product/sys/cart/mycart");
    tableData.value=res.data.cartItems;
    totalNum.value = res.data.totalNum
    totalAmount.value = res.data.totalAmount
    realPayAmount.value =  res.data.realPayAmount
    form.value = res.data
  }
   initShopList()
  
  </script>